import Vue from "vue";
import messgeBox from "./messgeBox/messgeBox.vue"

export var messgesBox = (function () {

    var defaults = {   //默认值
        title: '',
        content: '',
        cancel: '',
        ok: '',
        handleCancel: null,
        handleOk: null
    };

    var MyComponent = Vue.extend(messgeBox);

    return function (opts) {  //配置参数

        for (var attr in opts) {
            defaults[attr] = opts[attr];
        }

        var vm = new MyComponent({
            el: document.createElement('div'),
            data: {
                title: defaults.title,
                content: defaults.content,
                cancel: defaults.cancel,
                ok: defaults.ok
            },
            methods: {
                handleCancel() {
                    defaults.handleCancel && defaults.handleCancel.call(this);
                    document.body.removeChild(vm.$el);
                },
                handleOk() {
                    defaults.handleOk && defaults.handleOk.call(this);
                    document.body.removeChild(vm.$el);
                }
            }
        });

        document.body.appendChild(vm.$el);

    };

})();

// export const messgesBox = (() => {

//     let defaults = {   //默认值
//         title: '',
//         content: '',
//         cancel: '',
//         ok: '',
//         handleCancel: null,
//         handleOk: null
//     };

//     const MyComponent = Vue.extend(messgeBox);

//     return ((opts) => {
//         for (var attr in opts) {
//             defaults[attr] = opts[attr];
//         }

//         const vm = new MyComponent({
//             el: document.createElement('div'),
//             data: {
//                 title: defaults.title,
//                 content: defaults.content,
//                 cancel: defaults.cancel,
//                 ok: defaults.ok
//             },
//             methods: {
//                 handleCancel() {
//                     defaults.handleCancel && defaults.handleCancel
//                     document.body.removeChild(vm.$el);
//                 },
//                 handleOk() {
//                     defaults.handleOk && defaults.handleOk
//                     document.body.removeChild(vm.$el);
//                 }
//             }
//         });

//         document.body.appendChild(vm.$el);
//     })
// })